<!--
 * @Descripttion: 
 * @version: 
 * @Author: cyj
 * @Date: 2022-12-10 13:54:32
-->
<template>
    <div class="private-item" @click="click(item)">
        <div class="item-img">
            <img :src="item.picUrl" alt="">
            <div class="mask-playicon exct">
                <span class="iconfont icon-shipinbofangshibofang"></span>
            </div>

        </div>
        <div class="item-info">{{ item.name }}</div>
    </div>
</template>

<script setup>
import { useRouter } from 'vue-router'
defineProps({
    item: {
        type: Object,
        default: {}
    }
})
const router = useRouter()
//前往对应mv页面
function click(item) {
    router.push({
        name: 'Videodetail',
        params: { id: item.id, type: 'mv' }
    })
}
</script>

<style lang="scss" scoped>
.private-item {
    cursor: pointer;

    .item-img {
        height: 230px;
        width: 375px;
        position: relative;

        img {
            height: 100%;
            width: 100%;
        }

        .exct {
            justify-content: left;
            align-items: flex-start;
            top: 10px;
            left: 10px;
            background: none !important;
        }
    }

    .item-info {
        margin-top: 10px;
    }
}
</style>